<template>
  <div class="line-echarts">
    <baseECharts :options="options"></baseECharts>
  </div>
</template>

<script>
import baseECharts from "@/components/baseEChart.vue";
export default {
  components: {
    baseECharts,
  },
  props: {
  },
  computed: {
    options() {
      return {
        color:['#00f2f1','#ed3f35'],
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            textStyle:{
                color:"#4c9bfd"
            },
            right:'10%'
        },
        grid: {
            top:'20%',
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true,
            show:true,
            borderColor:'#012f4a'
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],
            axisTick: {
              show:false,
            },
            //修改坐标轴文字大小颜色等
            axisLabel: {
              color:'#4c9bfd'
            },
            // X轴样式不显示
            axisLine: {
              show: false,
            },
        },
        yAxis: {
            type: 'value',
            axisTick: {
              show:false,
            },
            //修改坐标轴文字大小颜色等
            axisLabel: {
              color:'#4c9bfd'
            },
            // X轴样式不显示
            axisLine: {
              show: false,
            },
            // y轴分割线样式
            splitLine: {
              lineStyle: {
                color: "rgba(255,255,255,.4)",
              },
            },
        },
        series: [
            {
            name: '新增粉丝',
            type: 'line',
            smooth:true,
            data: [24,40,101,134,90,230,210,230,120,230,210,120]
            },
            {
            name: '新增游客',
            type: 'line',
            smooth:true,
            data: [40,46,191,323,290,330,320,213,180,200,180,79]
            },
        ],
      };
    },
  },
};
</script>

<style lang="scss" scoped>
.bar-echarts{
    width: 100%;
    height: 100%;
}
</style>
